<template>
  <section>
    <h2>我是图片列表</h2>
    <ul class="list-video-box">
      <li v-for="item in listData" :key="item.t_content_pk" class="video-list">
        <img
          :src="item.resource_path"
          :title="item.title"
        >
        <h3>{{item.title}}</h3>
      </li>
    </ul>
    <list-pagination
      @page="handlePage"
      :page="page"
      :totalPage="totalPage"
    ></list-pagination>
  </section>
</template>
  
  <script>
import ListPagination from "./list-pagination.vue";
import ajax from "@/util/request";

export default {
  components: { ListPagination },
  props: {
    params: {
      type: Object,
    },
  },
  data() {
    return {
      listData: [],
      page: 1,
      totalPage: 1,
    };
  },
  methods: {
    handlePage(page) {
      this.queryList(this.params, page);
    },
    queryList(params, page) {
      this.page = page;
      ajax("/content/queryBannerContent", {
        t_cat_plant_fk: params.t_cat_plant_pk,
        rows: 20,
        page,
      }).then(({ data }) => {
        if (data.status > 0) {
          this.listData = data.result_data;
          this.totalPage = data.totalPage;
        }
      });
    },
  },
  watch: {
    params: {
      immediate: true,
      handler(newVal) {
        this.queryList(newVal, 1);
      },
    },
  },
};
</script>
  
<style scoped>
</style>